<template>
  <div>
    <div class="top-title">评论内容</div>
    <ul class="list">
      <li class="item" @click="gotoDetail(item)" v-for="(item,itemidx) in comment" :key="itemidx">
        <div class="item-title">
          <div class="left"><img mode="aspectFit" :src="item.image" />{{item.nickname}}</div>
          <div class="right">{{item.location||'未知地点'}} <span>--</span> {{item.phone||'未知设备'}}</div>
        </div>
        <div class="item-content">
          {{item.comment}}
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  props: ['comment','type'],
  methods: {
    gotoDetail(item){
      if( this.type === 'comment'){
        wx.navigateTo({
          url: `/pages/detail/main?id=${item.bookid}`
        })
      }
    }
  }
}
</script>

<style lang="stylus" scoped>
@import '~style/varibles'
.list
  background #eee
  .item
    margin-bottom 10px
    padding 10px
    background #fff
    .item-title
      display flex
      align-items center
      justify-content space-around
      .left
        flex 1
        img
          width 20px
          height 20px
          border-radius 50%
          margin-right 10px
      .right
        flex 1
        font-size 14px
        text-align right
        span
          color $themeColor
</style>
